<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="zh">
<head lang="en">
    <th:block th:include="include :: header('首页')" />
    <th:block th:include="include :: headertable" />
</head>
<body>
<div class="panel panel-success">
   <!-- <div class="panel-heading">
        <h3 class="panel-title">搜索条件</h3>
    </div>-->
    <div class="panel-body" style="padding: 0">

        <form class="layui-form layui-col-space5">
            <div class="layui-inline layui-show-xs-block">
                <input type="text" name="username" placeholder="请输入用户名" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-inline layui-show-xs-block">
                <input type="text" name="realName" placeholder="请输入真实姓名" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-inline layui-show-xs-block">
                <button class="layui-btn" lay-submit lay-filter="search"><i class="layui-icon">&#xe615;</i>搜索</button>
            </div>
        </form>
    </div>
</div>

<div id="toolbar">
    <button id="addAuthRole" class="layui-btn">+ 添加用户</button>
</div>

<table id="dataTable" lay-filter="dataTable"  class="layui-table"></table>

<th:block th:include="include :: footer" />
<th:block th:include="include :: footertable" />
<script>
    layui.use(['table','form'], function () {
        var table = layui.table;
        var form=layui.form;
        form.on('submit(search)', function(data){
            config.tableQuery("dataTable",data.field)
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        function operateFormatter(value, row, index) {
            var operateHtml = new Array();
            if (row.status == 0) {
                operateHtml.push('<button  class="layui-btn layui-btn-sm" id="startstop" ><i class="layui-icon">&#xe620;</i>停用</button>');
            } else {
                operateHtml.push('<button class="layui-btn layui-btn-sm" id="startstop" ><i class="layui-icon">&#xe620;</i>启用</button>');
            }
            operateHtml.push('<button data-method="confirmTrans" class="layui-btn layui-btn-sm" id="edit" ><i class="layui-icon">&#xe642;</i>编辑</button>');
            operateHtml.push('<button class="layui-btn layui-btn-sm layui-btn-danger" id="delete" > <i class="layui-icon">&#xe640;</i>删除</button>');
            return operateHtml.join('');
        }

        var operateEvents = {
            'click #startstop': function (e, value, row, index) {
                var tiaojian;
                var st;
                if (row.status == 0) {
                    tiaojian = '确定要停用么？';
                    st = 1;
                } else {
                    tiaojian = '确定要启用么？';
                    st = 0;
                }
                config.openConfirmLayer(tiaojian, '/sysUser/OFFauthRole.json', {
                    "id": row.id,
                    "status": st
                }, function (data) {
                    config.tableRefresh();
                })
            },
            'click #edit': function (e, value, row, index) {
                json = row;
                config.openPageLayer("编辑", "xtgl/authRoleBianJi", ['500px', '400px']);
            },
            'click #delete': function (e, value, row, index) {
                json = row;
                config.openConfirmLayer("确定删除吗？","/sysUser/DELauthRole.json",{"id":row.id},function (data) {
                    config.tableRefresh()
                })
            },
        };

        config.initTable("#dataTable", "/sysUser/authRoleList.json", [ //表头
                {field: 'id', title: 'ID'}
                , {field: 'username', title: '角色名'}
                , {field: 'realName', title: '真实姓名'}
                , {field: 'createTime', title: '注册时间'}
                , {field: 'name', title: '权限'}
                , {field: 'statusString', title: '状态'}
                , {title: '操作', events: operateEvents, formatter: operateFormatter}
            ]
            , {});

        $(document).on('click', '#addAuthRole', function () {
            json={};
            config.openPageLayer("添加用户", 'xtgl/authRoleBianJi', ['500px', '400px']);
        })
    })
</script>

</body>
</html>
